<template>
  <div id="p_tasktwo" class="p_task">
     <div style="width: 100%; overflow:scroll;-webkit-overflow-scrolling:touch;position:fixed;left:0;top:0;z-index:1;">
        <tab :line-width="1">
            <tab-item @on-item-click="$router.push('/n_tasktwo/none')" :selected="$route.path=='/n_tasktwo/none'">任务箱</tab-item>
            <tab-item @on-item-click="$router.push('/n_tasktwo/today')" :selected="$route.path=='/n_tasktwo/today'">今日</tab-item>
            <tab-item @on-item-click="$router.push('/n_tasktwo/project')" :selected="$route.path=='/n_tasktwo/project'">项目</tab-item>
            <tab-item @on-item-click="$router.push('/n_tasktwo/habit')" ::selected="$route.path=='/n_tasktwo/habit'">习惯养成</tab-item>
            <tab-item @on-item-click="$router.push('/n_tasktwo/taskmd')" :selected="$route.path=='/n_tasktwo/taskmd'">日报</tab-item>
        </tab>
    </div>
    <div style="height:44px;"></div>
    <router-view ref="taskRouter" class="view" keep-alive></router-view>
    <login-win :show="showLogin" v-on:toVisible="loginWinVis"></login-win>
  </div>
</template>
<script>

import api from '../api';
import { taskAndTag  } from "./mixin";
import LoginWin from "./LoginWin";

import {mapState,mapActions} from 'vuex'

import {
    Tab,TabItem,Sticky
} from 'vux'

export default {
    components: {
        Tab,TabItem,Sticky,LoginWin
    },
    mixins: [taskAndTag],    
    computed: {
        ...mapState({
            uid: state => state.vux.uid,
            taskAll: state => state.z39.taskAll,
        })
    },
    watch: {
    },
    mounted: function() {
        setTimeout(() => {
            this.delayShow = true;
        }, 500);
        this.$vux && this.$vux.bus && this.$vux.bus.$on('dologin', this.resetIndex);
        this.$vux && this.$vux.bus && this.$vux.bus.$on('showlogin', this.showloginWin);
        this.$socket.emit('connect', "7dtime.com");
    },
    methods: {
        resetIndex(val){
            this.timeindex = 1;
            console.log("resetIndex",val);
        },
        loginWinVis(val){
            this.showLogin = false ;
            if(val) this.$vux && this.$vux.bus && this.$vux.bus.$emit('loginDone', true);
        },
        showloginWin(){
            this.showLogin = true ;
        }
    },
    data() {
        return {
            timeindex: 1,
            delayShow:false,
            showLogin:false,
        }
    }
}

</script>
<style scoped>

.day-item {
  border: 1px solid #ececec;
  padding: 5px 15px;
}
.day-item-selected {
  border: 1px solid green;
}

.weui-cell img {
    max-width: 100px;
    height: 44px;
    margin-right: 10px;
    width: auto;
}
</style>
<style>
.p_task .weui-cell .weui-cell__hd{max-height: 50px;}
.p_task .weui-cell{padding: 10px}
.p_task .weui-cells {
    margin-top: 0px;
}
.p_task .weui-cell img {
    /*max-width: 100px;
    width: auto;*/
    height: 50px;
    width: 50px;
    margin-right: 10px;
}
.p_task .task_done p{
    text-decoration:line-through;
}
.p_task .task_cancle{
    text-decoration:line-through;
    color: #b0b6bb;
}
.p_task .task_going{
    color: #10aeff;
}
.p_task .task_toggle{
    color: #e64340;
}
.p_task .task_curr .weui-cell{    
    border-left: 5px solid #10aeff;
    border-radius: 4px;
    padding-left: 5px;
}
.p_task .task_curr .taskCount,.p_task .task_done .taskCount,.p_task .task_cancle .taskCount,.p_task .task_going .taskCount,.p_task .task_toggle .taskCount{color: #000000;}
#p_task .weui-cells {
    margin-top: 0px;
}

#p_task .weui-search-bar:before {
    height: 0;
    border-top: 0;
}
/*#p_task .vux-tab .vux-tab-item{
    background: #fff;
}*/
#p_task .day  .vux-tab-selected {
    background: #eee;
    border-radius: 4px;
}

#p_task .vux-label-desc{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
#p_task .vux-label,#p_task .tTitle{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.p_task .weui-cell .weui-cell__hd .taskCount{
    position:absolute;bottom:10px;left:10px;width: 50px;text-align: center;border-radius: 0 0 8px 8px;background-color: #10aeff87;height:14px; overflow:hidden;font-size: 12px;
}

.p_task .task_curr .weui-cell .weui-cell__hd .taskCount{
    left: 5px;
}
.flagshow{
 display:flex;  
 height:30px;
 overflow:scroll;-webkit-overflow-scrolling:touch;background-color:#fff;
 width: 100%;
}
.flagshow span{
    height: 30px;
    line-height: 30px;
    background-position: right center;
    background-image: url(/static/z39h5/images/arrowR.png);    
    padding: 0 15px 0 15px;
    background-repeat: no-repeat;
    background-size: contain;
    min-width: 60px;
    /*background-color: #c2eaff;*/
}
</style>
